<script setup>
import { onMounted, ref } from "vue";
import { useRouter } from 'vue-router'

const router = useRouter()
const time = ref(5)
let timer;
onMounted(() => {
  timer = setInterval(() => {
    time.value -= 1
    if (time.value === -1) {
      router.replace('/')
      clearInterval(timer)
    }
  }, 1000)


})
</script>

<template>
  <el-empty description="404NotFound" :image-size="300">
    <el-button plain size="large" type="danger" @click="$router.replace('/')"><span style="blue">{{ time
    }}</span>&nbsp;后自动返回首页</el-button>
  </el-empty>
</template>

<style scoped lang="scss">
:deep .el-empty__description p {
  font-size: 30px !important;
}
</style>
